<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>08.jquery的ajax</title>
    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/2.2.4/jquery.js"></script>
</head>

<body>
    <button id="btnNode">get获取数据</button>
    <button id="btnNode2">get JSON 获取数据</button>
    <button id="btnNode3">post获取数据</button>
    <button id="btnNode4">post获取数据 带有参数</button>
    <script>
        
        btnNode.onclick = function () {
            // 发送get请求
            // $.get("http://www.phonegap100.com/appapi.php?a=getPortalList&catid=20&page=1", function (data) {
            //     console.log(JSON.parse(data));
            // })
            $.get("http://www.phonegap100.com/appapi.php", {
                a:"getPortalList",
                catid:20,
                page:1
            },function (data) {
                console.log(JSON.parse(data));
            })
        }

        // getJSON 目的  就是最直接将json字符串转为json对象
        btnNode2.onclick = function () {
            // 发送get请求
            $.getJSON("http://www.phonegap100.com/appapi.php?a=getPortalList&catid=20&page=1", function (data) {
                console.log(data);
            })
        }

        // 发送的是post请求
        btnNode3.onclick = function () {
            $.post("https://httpbin.org/post", function (data) {
                console.log(data);
            })
        }

        // 发送的是post请求
        btnNode4.onclick = function () {
            $.post("https://httpbin.org/post", {
                username:"小明",
                password:"123456"
            },function (data) {
                console.log(data);
            })
        }
    </script>

</body>

</html>